<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>登陆</title>
<meta name="description" content="">
<style>
*{margin:0;padding:0;}
ul li{list-style-type:none;float:left;}
body,html{font:12px/1.5 "Microsoft Yahei","Helvetica Neue";color:#34495e;height: 100%;position: relative;}
p{word-break: break-all;}
.login-bg{width:100%;background: url("images/login-bg.jpg") center;height: 100%;}
.login-box{background: #e2e5d8;width: 410px;height: 460px;border-radius: 5px;position: absolute;top: 50%;left: 50%;margin:-230px 0 0 -205px;box-shadow: 2px 2px 5px #333333;overflow: hidden;}

.login-box-form {padding: 40px;}
.login-box-form label{position: relative;}
.login-box-form label span{position:absolute;width:40px;height:20px;left: 8px;top: 10px;z-index: 99;}
.login-box-form label .phone,.password{padding:10px 0 10px 40px;width: 295px;margin-bottom: 20px;}

.login-box-form .form-select{float: left;margin:0 35px 20px 0;}
.login-box-form .form-select input{margin-right: 5px;width: 15px;height: 15px;}
.submit{background: #148aff;color: #fff;font-size: 22px;text-align: center;line-height: 50px;width: 100%;}
.message{text-align: center;font-size: 14px;margin-top: 10px;color: red;}
</style>
</head>
<body>
      <div class="login-bg"></div>
      <div class="login-box">
          <img src="images/login-top.png" />
          <form class="login-box-form" id="loginForm">
              <label>
                  <span>账号：</span>
                  <div class="user-input-lay">
                      <input type="text" name="username" class="phone">
                  </div>
              </label>
              <label>
                  <span>密码</span>
                  <div class="user-input-lay">
                      <input type="password" name="password" class="password">
                  </div>
              </label>
             <!--  <div class="form-select">
                  <input type="checkbox" name="sport" value="">
                  记住密码
              </div>
              <div class="form-select">
                  <input type="checkbox" name="sport" value="">
                  自动登录
              </div> -->
              <button type="button" class="submit" id="submit">
                  登录
              </button>
              <div class="message" id="message"></div>
          </form>
      </div>
</body>
    <script type="text/javascript" src="./jquery-1.11.3.min.js"></script>
    <script type="text/javascript">
      $(function(){
          function login(){
              var getData = $('#loginForm').serialize();
              $.ajax({
                  type: "POST",
                  url: "http://www.u-non.com/admin/login",
                  dataType: "json",
                  data : getData,
                  success : function(){
                      location.href = '/admin/#/index.html';
                  },
                  error : function(data){
                      $('#message').html(data.responseJSON.msg)
                  }
              });
          }

          $('#submit').click(function(){
              login();
          });

          $('body').keyup(function(evt){
              if(evt.keyCode === 13){
                  login();
              }
          })
      });
    </script>
</html>